<!-- 
Create By ZeeVN
                进无止境
-->
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>播放器</title>
    <link rel="stylesheet" href="./index.css" type="text/css" />
</head>

<body>
    <div id="container">
        <video id="video" preload="metadata" onclick="setVideoState()">
        <!-- 实现支持多种视频源或视频格式的播放类型 -->
        <source
        src="http://sf1-ttcdn-tos.pstatp.com/obj/ttfe/ATSX/mainland/gongquhunjian_1080.min.mp4"
          type="video/mp4"
        />
        <source
        src="http://sf1-ttcdn-tos.pstatp.com/obj/ttfe/ATSX/mainland/gongquhunjian_1080.min.mp4"
          type="video/webm"
        />
        <!-- Ogg格式主要用于支持低版本的浏览器 -->
        <source
        src="http://sf1-ttcdn-tos.pstatp.com/obj/ttfe/ATSX/mainland/gongquhunjian_1080.min.mp4"
          type="video/ogg"
        />
        <source
        src="http://sf1-ttcdn-tos.pstatp.com/obj/ttfe/ATSX/mainland/gongquhunjian_1080.min.mp4"
          type="video/flac"
        />
        <!-- 后续会支持更多... -->
        <p>你的浏览器不支持HTML5 video，请下载相关浏览器后在进行相关打开操作</p>
      </video>
        <!-- 视频控制条 -->
        <div id="control-body">
            <div id="progress-bar">
                <div id="progress-cached"></div>
                <div id="progress-finished"></div>
            </div>
            <div id="control-components">
                <button class="btn btn-play" onclick="setVideoState()">
            <svg
              xmlns="http://www.w3.org/2000/svg"
              width="20"
              height="20"
              viewBox="0 0 20 20"
            >
              <path
                fill="#fff"
                d="M19.0773 11.4127L6.589 19.4475c-.7803.502-1.8198.2764-2.3218-.5039A1.68 1.68 0 014 18.0346V1.9652c0-.9279.7522-1.68 1.68-1.68a1.68 1.68 0 01.909.2671L19.0773 8.587c.7803.502 1.0059 1.5416.5039 2.3219a1.68 1.68 0 01-.5039.5038z"
              ></path>
            </svg>
          </button>
                <button class="btn btn-next">
            <svg
              xmlns="http://www.w3.org/2000/svg"
              xmlns:xlink="http://www.w3.org/1999/xlink"
              width="20"
              height="20"
              viewBox="0 0 20 20"
            >
              <path
                fill="#ffffff"
                d="M17.07 1.6c.84 0 1.53.69 1.53 1.53v13.74a1.53 1.53 0 01-3.06 0V3.13c0-.84.68-1.53 1.53-1.53zM2.92 2c.22 0 .43.07.62.2l10.42 6.86a1.12 1.12 0 010 1.87L3.54 17.81a1.12 1.12 0 01-1.74-.94V3.13C1.8 2.5 2.3 2 2.92 2z"
              ></path>
            </svg>
          </button>
                <div class="time">
                    <span id="currentTime">00:00</span>&nbsp;/&nbsp;<span id="duration"></span>
                </div>
                <div class="place"></div>
                <div class="ratio" onmouseenter="setVideoRationaleShow()" onmouseleave="setVideoRationaleHide()">
                    自动
                    <ul class="ratio-list" onmouseleave="setVideoRationaleHide()">
                        <li onclick="changeVideoRatio(1080)">高清 1080P</li>
                        <li onclick="changeVideoRatio(720)">高清 720P</li>
                        <li onclick="changeVideoRatio(480)">标清 480P</li>
                        <li onclick="changeVideoRatio(360)">标清 360P</li>
                    </ul>
                </div>
                <div class="rate">倍速</div>
                <button class="btn loop" aria-label="循环" aria-haspopup="true" aria-expanded="false">
            <svg
              xmlns="http://www.w3.org/2000/svg"
              xmlns:xlink="http://www.w3.org/1999/xlink"
              width="20"
              height="20"
              viewBox="0 0 20 20"
            >
              <path
                d="M14.5,1.38309519 C14.590622,1.38309519 14.6795402,1.40772411 14.7572479,1.45434873 L18.2854226,3.57125354 C18.5222127,3.71332762 18.5989952,4.02045774 18.4569211,4.25724788 C18.4146963,4.32762268 18.3557974,4.38652158 18.2854226,4.42874646 L14.7572479,6.54565127 C14.5204577,6.68772535 14.2133276,6.61094282 14.0712535,6.37415269 C14.0246289,6.29644499 14,6.20752678 14,6.11690481 L14,4.99909519 L4,5 C3.48716416,5 3.06449284,5.38604019 3.00672773,5.88337887 L3,6 L3,15 C3,15.5128358 3.38604019,15.9355072 3.88337887,15.9932723 L4,16 L7,16 C7.55228475,16 8,16.4477153 8,17 C8,17.5522847 7.55228475,18 7,18 L3,18 C1.8954305,18 1,17.1045695 1,16 L1,5 C1,3.8954305 1.8954305,3 3,3 L14,2.99909519 L14,1.88309519 C14,1.60695281 14.2238576,1.38309519 14.5,1.38309519 Z M14,8 C16.7614237,8 19,10.2385763 19,13 C19,15.7614237 16.7614237,18 14,18 C11.2385763,18 9,15.7614237 9,13 C9,10.2385763 11.2385763,8 14,8 Z M11.292515,11.7062836 C11.1050059,12.0979951 11,12.5367348 11,13 C11,14.6568542 12.3431458,16 14,16 C14.4632652,16 14.9020049,15.8949941 15.2937164,15.707485 L11.292515,11.7062836 Z M14,10 C13.5367348,10 13.0979951,10.1050059 12.7062836,10.292515 L16.707485,14.2937164 C16.8949941,13.9020049 17,13.4632652 17,13 C17,11.3431458 15.6568542,10 14,10 Z"
                fill="#FFFFFF"
                fill-rule="nonzero"
              ></path>
            </svg>
          </button>
                <button class="btn settings" tabindex="0" aria-label="设置" aria-haspopup="true" aria-expanded="false">
            <svg
              xmlns="http://www.w3.org/2000/svg"
              viewBox="0 0 30 30"
              width="30"
              height="30"
              preserveAspectRatio="xMidYMid meet"
              style="
                width: 100%;
                height: 100%;
                transform: translate3d(0px, 0px, 0px);
              "
            >
              <defs>
                <clipPath id="__lottie_element_54">
                  <rect width="30" height="30" x="0" y="0"></rect>
                </clipPath>
              </defs>
              <g clip-path="url(#__lottie_element_54)">
                <g
                  transform="matrix(1,0,0,1,15,15)"
                  opacity="0.8"
                  style="display: block"
                >
                  <g opacity="1" transform="matrix(1,0,0,1,0,0)">
                    <path
                      fill="rgb(255,255,255)"
                      fill-opacity="1"
                      d=" M0,-2 C1.100000023841858,-2 2,-1.100000023841858 2,0 C2,1.100000023841858 1.100000023841858,2 0,2 C-1.100000023841858,2 -2,1.100000023841858 -2,0 C-2,-1.100000023841858 -1.100000023841858,-2 0,-2z M0,-5 C-2.759999990463257,-5 -5,-2.759999990463257 -5,0 C-5,2.759999990463257 -2.759999990463257,5 0,5 C2.759999990463257,5 5,2.759999990463257 5,0 C5,-0.36000001430511475 4.960000038146973,-0.7099999785423279 4.889999866485596,-1.0499999523162842 C4.400000095367432,-3.3399999141693115 2.369999885559082,-5 0,-5z M0,-9 C0.550000011920929,-9 1,-8.550000190734863 1,-8 C1,-8 1,-6.929999828338623 1,-6.929999828338623 C2.190000057220459,-6.760000228881836 3.2799999713897705,-6.289999961853027 4.190000057220459,-5.610000133514404 C4.190000057220459,-5.610000133514404 4.949999809265137,-6.360000133514404 4.949999809265137,-6.360000133514404 C5.340000152587891,-6.75 5.96999979019165,-6.75 6.360000133514404,-6.360000133514404 C6.75,-5.96999979019165 6.75,-5.340000152587891 6.360000133514404,-4.949999809265137 C6.360000133514404,-4.949999809265137 5.610000133514404,-4.190000057220459 5.610000133514404,-4.190000057220459 C6.199999809265137,-3.4000000953674316 6.630000114440918,-2.4700000286102295 6.849999904632568,-1.4700000286102295 C6.880000114440918,-1.3200000524520874 6.909999847412109,-1.159999966621399 6.929999828338623,-1 C6.929999828338623,-1 8,-1 8,-1 C8.550000190734863,-1 9,-0.550000011920929 9,0 C9,0.550000011920929 8.550000190734863,1 8,1 C8,1 6.929999828338623,1 6.929999828338623,1 C6.760000228881836,2.190000057220459 6.289999961853027,3.2799999713897705 5.610000133514404,4.190000057220459 C5.610000133514404,4.190000057220459 6.360000133514404,4.949999809265137 6.360000133514404,4.949999809265137 C6.75,5.340000152587891 6.75,5.96999979019165 6.360000133514404,6.360000133514404 C5.96999979019165,6.75 5.340000152587891,6.75 4.949999809265137,6.360000133514404 C4.949999809265137,6.360000133514404 4.190000057220459,5.610000133514404 4.190000057220459,5.610000133514404 C3.2799999713897705,6.289999961853027 2.190000057220459,6.760000228881836 1,6.929999828338623 C1,6.929999828338623 1,8 1,8 C1,8.550000190734863 0.550000011920929,9 0,9 C-0.550000011920929,9 -1,8.550000190734863 -1,8 C-1,8 -1,6.929999828338623 -1,6.929999828338623 C-2.190000057220459,6.760000228881836 -3.2799999713897705,6.289999961853027 -4.190000057220459,5.610000133514404 C-4.190000057220459,5.610000133514404 -4.949999809265137,6.360000133514404 -4.949999809265137,6.360000133514404 C-5.340000152587891,6.75 -5.96999979019165,6.75 -6.360000133514404,6.360000133514404 C-6.75,5.96999979019165 -6.75,5.340000152587891 -6.360000133514404,4.949999809265137 C-6.360000133514404,4.949999809265137 -5.610000133514404,4.190000057220459 -5.610000133514404,4.190000057220459 C-6.289999961853027,3.2799999713897705 -6.760000228881836,2.190000057220459 -6.929999828338623,1 C-6.929999828338623,1 -8,1 -8,1 C-8.550000190734863,1 -9,0.550000011920929 -9,0 C-9,-0.550000011920929 -8.550000190734863,-1 -8,-1 C-8,-1 -6.929999828338623,-1 -6.929999828338623,-1 C-6.760000228881836,-2.190000057220459 -6.289999961853027,-3.2799999713897705 -5.610000133514404,-4.190000057220459 C-5.610000133514404,-4.190000057220459 -6.360000133514404,-4.949999809265137 -6.360000133514404,-4.949999809265137 C-6.75,-5.340000152587891 -6.75,-5.96999979019165 -6.360000133514404,-6.360000133514404 C-5.96999979019165,-6.75 -5.340000152587891,-6.75 -4.949999809265137,-6.360000133514404 C-4.949999809265137,-6.360000133514404 -4.190000057220459,-5.610000133514404 -4.190000057220459,-5.610000133514404 C-3.2799999713897705,-6.289999961853027 -2.190000057220459,-6.760000228881836 -1,-6.929999828338623 C-1,-6.929999828338623 -1,-8 -1,-8 C-1,-8.550000190734863 -0.550000011920929,-9 0,-9z"
                    ></path>
                  </g>
                </g>
              </g>
            </svg>
          </button>
                <button class="btn voice" aria-label="静音" tabindex="0">
            <svg
              class="volume-muted"
              style="display: none"
              xmlns="http://www.w3.org/2000/svg"
              xmlns:xlink="http://www.w3.org/1999/xlink"
              width="20"
              height="20"
              viewBox="0 0 20 20"
            >
              <path
                d="M14.586 7.303L16 8.716l1.414-1.413a1 1 0 111.414 1.414l-1.414 1.414 1.414 1.415a1 1 0 11-1.414 1.414L16 11.545l-1.414 1.415a1 1 0 11-1.414-1.414l1.413-1.415-1.413-1.414a1 1 0 111.414-1.414z"
                fill="#FFF"
              ></path>
              <path
                d="M10.375 2.22a1 1 0 011.62.668L12 3v14a1 1 0 01-1.534.846l-.09-.065-4.727-3.782L3 14a2 2 0 01-1.977-1.697l-.018-.154L1 12V8a2 2 0 011.85-1.995L3 6h2.649l4.726-3.78zM6 12a1 1 0 01.513.142l.112.077L10 14.92V5.08L6.625 7.781a1 1 0 01-.49.21L6 8H4a1 1 0 00-.993.883L3 9v2l.007.117a1 1 0 00.876.876L4 12h2z"
                fill="#FFF"
                fill-rule="nonzero"
              ></path>
            </svg>
            <svg
              xmlns="http://www.w3.org/2000/svg"
              viewBox="0 0 30 30"
              width="30"
              height="30"
              class="xgplayer-volume-lottie"
              preserveAspectRatio="xMidYMid meet"
              style="
                width: 100%;
                height: 100%;
                transform: translate3d(0px, 0px, 0px);
              "
            >
              <defs>
                <clipPath id="__lottie_element_7">
                  <rect width="30" height="30" x="0" y="0"></rect>
                </clipPath>
              </defs>
              <g clip-path="url(#__lottie_element_7)">
                <g
                  transform="matrix(1,0,0,1,11.5,15.00100040435791)"
                  opacity="0.8"
                  style="display: block"
                >
                  <g opacity="1" transform="matrix(1,0,0,1,0,0)">
                    <path
                      fill="rgb(255,255,255)"
                      fill-opacity="1"
                      d=" M-0.5,1.9989999532699585 C-0.3199999928474426,1.9989999532699585 -0.14000000059604645,2.0490000247955322 0.009999999776482582,2.1389999389648438 C0.009999999776482582,2.1389999389648438 0.11999999731779099,2.2190001010894775 0.11999999731779099,2.2190001010894775 C0.11999999731779099,2.2190001010894775 3.5,4.919000148773193 3.5,4.919000148773193 C3.5,4.919000148773193 3.5,-4.921000003814697 3.5,-4.921000003814697 C3.5,-4.921000003814697 0.11999999731779099,-2.2209999561309814 0.11999999731779099,-2.2209999561309814 C-0.019999999552965164,-2.1010000705718994 -0.1899999976158142,-2.0309998989105225 -0.36000001430511475,-2.010999917984009 C-0.36000001430511475,-2.010999917984009 -0.5,-2.000999927520752 -0.5,-2.000999927520752 C-0.5,-2.000999927520752 -2.5,-2.000999927520752 -2.5,-2.000999927520752 C-3.009999990463257,-2.000999927520752 -3.440000057220459,-1.6109999418258667 -3.490000009536743,-1.121000051498413 C-3.490000009536743,-1.121000051498413 -3.5,-1.0010000467300415 -3.5,-1.0010000467300415 C-3.5,-1.0010000467300415 -3.5,0.9990000128746033 -3.5,0.9990000128746033 C-3.5,0.9990000128746033 -3.490000009536743,1.11899995803833 -3.490000009536743,1.11899995803833 C-3.440000057220459,1.5789999961853027 -3.0799999237060547,1.9390000104904175 -2.619999885559082,1.9889999628067017 C-2.619999885559082,1.9889999628067017 -2.5,1.9989999532699585 -2.5,1.9989999532699585 C-2.5,1.9989999532699585 -0.5,1.9989999532699585 -0.5,1.9989999532699585z M3.880000114440918,-7.7820000648498535 C4.5,-8.281999588012695 5.409999847412109,-7.881999969482422 5.489999771118164,-7.111999988555908 C5.489999771118164,-7.111999988555908 5.5,-7.001999855041504 5.5,-7.001999855041504 C5.5,-7.001999855041504 5.5,6.998000144958496 5.5,6.998000144958496 C5.5,7.797999858856201 4.619999885559082,8.258000373840332 3.9700000286102295,7.8480000495910645 C3.9700000286102295,7.8480000495910645 3.880000114440918,7.7779998779296875 3.880000114440918,7.7779998779296875 C3.880000114440918,7.7779998779296875 -0.8500000238418579,3.997999906539917 -0.8500000238418579,3.997999906539917 C-0.8500000238418579,3.997999906539917 -3.5,3.997999906539917 -3.5,3.997999906539917 C-4.5,3.997999906539917 -5.329999923706055,3.2679998874664307 -5.480000019073486,2.2980000972747803 C-5.480000019073486,2.2980000972747803 -5.489999771118164,2.1480000019073486 -5.489999771118164,2.1480000019073486 C-5.489999771118164,2.1480000019073486 -5.5,1.9980000257492065 -5.5,1.9980000257492065 C-5.5,1.9980000257492065 -5.5,-2.002000093460083 -5.5,-2.002000093460083 C-5.5,-3.052000045776367 -4.679999828338623,-3.921999931335449 -3.6500000953674316,-3.992000102996826 C-3.6500000953674316,-3.992000102996826 -3.5,-4.001999855041504 -3.5,-4.001999855041504 C-3.5,-4.001999855041504 -0.8500000238418579,-4.001999855041504 -0.8500000238418579,-4.001999855041504 C-0.8500000238418579,-4.001999855041504 3.880000114440918,-7.7820000648498535 3.880000114440918,-7.7820000648498535z"
                    ></path>
                  </g>
                </g>
                <g
                  transform="matrix(1,0,0,1,22.000999450683594,15)"
                  opacity="0.8"
                  style="display: block"
                >
                  <g opacity="1" transform="matrix(1,0,0,1,0,0)">
                    <path
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      fill-opacity="0"
                      stroke="rgb(255,255,255)"
                      stroke-opacity="1"
                      stroke-width="2"
                      d=" M-0.9990000128746033,-5.289999961853027 C0.2409999966621399,-3.880000114440918 1.0010000467300415,-2.0299999713897705 1.0010000467300415,0 C1.0010000467300415,2.0299999713897705 0.2409999966621399,3.880000114440918 -0.9990000128746033,5.289999961853027"
                    ></path>
                  </g>
                </g>
                <g
                  style="display: none"
                  transform="matrix(0.3004733920097351,0,0,0.3004733920097351,16.00505828857422,15)"
                  opacity="0.0006762880363723888"
                >
                  <g opacity="1" transform="matrix(1,0,0,1,0,0)">
                    <path
                      stroke-linecap="round"
                      stroke-linejoin="round"
                      fill-opacity="0"
                      stroke="rgb(255,255,255)"
                      stroke-opacity="1"
                      stroke-width="2"
                      d=" M-0.9990000128746033,-5.289999961853027 C0.2409999966621399,-3.880000114440918 1.0010000467300415,-2.0299999713897705 1.0010000467300415,0 C1.0010000467300415,2.0299999713897705 0.2409999966621399,3.880000114440918 -0.9990000128746033,5.289999961853027"
                    ></path>
                  </g>
                </g>
              </g>
            </svg>
          </button>
                <button class="btn theaterMode" tabindex="0" aria-label="剧场模式" role="button">
            <svg
                xmlns="http://www.w3.org/2000/svg"
                viewBox="0 0 30 30"
                width="30"
                height="30"
                class="xgplayer-theaterMode-enter"
                preserveAspectRatio="xMidYMid meet"
                style="
                  width: 100%;
                  height: 100%;
                  transform: translate3d(0px, 0px, 0px);
                "
              >
                <g clip-path="url(#__lottie_element_18)">
                  <g
                    transform="matrix(1,0,0,1,15,15)"
                    opacity="0.8"
                    style="display: block"
                  >
                    <g opacity="1" transform="matrix(1,0,0,1,0,0)">
                      <path
                        fill="rgb(255,255,255)"
                        fill-opacity="1"
                        d=" M5.995999813079834,-5.061999797821045 C5.995999813079834,-5.061999797821045 -6.058000087738037,-5.061999797821045 -6.058000087738037,-5.061999797821045 C-6.570000171661377,-5.061999797821045 -7.001999855041504,-4.670000076293945 -7.052000045776367,-4.177000045776367 C-7.052000045776367,-4.177000045776367 -7.061999797821045,-4.056000232696533 -7.061999797821045,-4.056000232696533 C-7.061999797821045,-4.056000232696533 -7.061999797821045,3.99399995803833 -7.061999797821045,3.99399995803833 C-7.061999797821045,4.506999969482422 -6.671000003814697,4.940000057220459 -6.178999900817871,4.989999771118164 C-6.178999900817871,4.989999771118164 -6.058000087738037,5 -6.058000087738037,5 C-6.058000087738037,5 5.995999813079834,5 5.995999813079834,5 C6.507999897003174,5 6.940000057220459,4.607999801635742 6.989999771118164,4.114999771118164 C6.989999771118164,4.114999771118164 7,3.99399995803833 7,3.99399995803833 C7,3.99399995803833 7,-4.056000232696533 7,-4.056000232696533 C7,-4.568999767303467 6.607999801635742,-5.001999855041504 6.116000175476074,-5.052000045776367 C6.116000175476074,-5.052000045776367 5.995999813079834,-5.061999797821045 5.995999813079834,-5.061999797821045z M7,-7 C8.100000381469727,-7 9,-6.099999904632568 9,-5 C9,-5 9,5 9,5 C9,6.099999904632568 8.100000381469727,7 7,7 C7,7 -7,7 -7,7 C-8.100000381469727,7 -9,6.099999904632568 -9,5 C-9,5 -9,-5 -9,-5 C-9,-6.099999904632568 -8.100000381469727,-7 -7,-7 C-7,-7 7,-7 7,-7z"
                      ></path>
                    </g>
                  </g>
                </g>
              </svg>
              <svg
                xmlns="http://www.w3.org/2000/svg"
                viewBox="0 0 30 30"
                width="30"
                height="30"
                class="xgplayer-theaterMode-exit"
                preserveAspectRatio="xMidYMid meet"
                style="
                  width: 100%;
                  height: 100%;
                  transform: translate3d(0px, 0px, 0px);
                "
              >
                <g clip-path="url(#__lottie_element_23)">
                  <g
                    transform="matrix(1,0,0,1,15,15)"
                    opacity="0.8"
                    style="display: block"
                  >
                    <g opacity="1" transform="matrix(1,0,0,1,0,0)">
                      <path
                        fill="rgb(255,255,255)"
                        fill-opacity="1"
                        d=" M5.995999813079834,-5.061999797821045 C5.995999813079834,-5.061999797821045 -6.058000087738037,-5.061999797821045 -6.058000087738037,-5.061999797821045 C-6.570000171661377,-5.061999797821045 -7.001999855041504,-4.670000076293945 -7.052000045776367,-4.177000045776367 C-7.052000045776367,-4.177000045776367 -7.061999797821045,-4.056000232696533 -7.061999797821045,-4.056000232696533 C-7.061999797821045,-4.056000232696533 -7.061999797821045,3.99399995803833 -7.061999797821045,3.99399995803833 C-7.061999797821045,4.506999969482422 -6.671000003814697,4.940000057220459 -6.178999900817871,4.989999771118164 C-6.178999900817871,4.989999771118164 -6.058000087738037,5 -6.058000087738037,5 C-6.058000087738037,5 5.995999813079834,5 5.995999813079834,5 C6.507999897003174,5 6.940000057220459,4.607999801635742 6.989999771118164,4.114999771118164 C6.989999771118164,4.114999771118164 7,3.99399995803833 7,3.99399995803833 C7,3.99399995803833 7,-4.056000232696533 7,-4.056000232696533 C7,-4.568999767303467 6.607999801635742,-5.001999855041504 6.116000175476074,-5.052000045776367 C6.116000175476074,-5.052000045776367 5.995999813079834,-5.061999797821045 5.995999813079834,-5.061999797821045z M7,-7 C8.100000381469727,-7 9,-6.099999904632568 9,-5 C9,-5 9,5 9,5 C9,6.099999904632568 8.100000381469727,7 7,7 C7,7 -7,7 -7,7 C-8.100000381469727,7 -9,6.099999904632568 -9,5 C-9,5 -9,-5 -9,-5 C-9,-6.099999904632568 -8.100000381469727,-7 -7,-7 C-7,-7 7,-7 7,-7z"
                      ></path>
                    </g>
                  </g>
                </g>
              </svg>
              </xg-icon>
            <div class="theaterMode-show" tabindex="8">
              剧场模式
            </div>
          </button>
                <button class="btn full-page-web" tabindex="0" aria-labelledby="xg-cssfullscreen-tips"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="30" height="30" class="xgplayer-cssfullscreen-enter" preserveAspectRatio="xMidYMid meet" style="width: 100%; height: 100%; transform: translate3d(0px, 0px, 0px);"><defs><clipPath id="__lottie_element_28"><rect width="30" height="30" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_28)"><g transform="matrix(1,0,0,1,15.001999855041504,15)" opacity="0.8" style="display: block;"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,255,255)" fill-opacity="1" d=" M-2.003999948501587,-4 C-1.4539999961853027,-4 -1.003999948501587,-3.549999952316284 -1.003999948501587,-3 C-1.003999948501587,-2.450000047683716 -1.4539999961853027,-2 -2.003999948501587,-2 C-2.003999948501587,-2 -3.003999948501587,-2 -3.003999948501587,-2 C-3.003999948501587,-2 -3.003999948501587,-1 -3.003999948501587,-1 C-3.003999948501587,-0.44999998807907104 -3.4539999961853027,0 -4.004000186920166,0 C-4.553999900817871,0 -5.004000186920166,-0.44999998807907104 -5.004000186920166,-1 C-5.004000186920166,-1 -5.004000186920166,-3 -5.004000186920166,-3 C-5.004000186920166,-3.1600000858306885 -4.964000225067139,-3.309999942779541 -4.9039998054504395,-3.440000057220459 C-4.9039998054504395,-3.440000057220459 -4.843999862670898,-3.5399999618530273 -4.843999862670898,-3.5399999618530273 C-4.673999786376953,-3.809999942779541 -4.363999843597412,-4 -4.004000186920166,-4 C-4.004000186920166,-4 -2.003999948501587,-4 -2.003999948501587,-4z M4.000999927520752,0 C4.560999870300293,0 5.000999927520752,0.44999998807907104 5.000999927520752,1 C5.000999927520752,1 5.000999927520752,3 5.000999927520752,3 C5.000999927520752,3.1600000858306885 4.9710001945495605,3.309999942779541 4.901000022888184,3.440000057220459 C4.901000022888184,3.440000057220459 4.85099983215332,3.5399999618530273 4.85099983215332,3.5399999618530273 C4.671000003814697,3.809999942779541 4.361000061035156,4 4.000999927520752,4 C4.000999927520752,4 2.000999927520752,4 2.000999927520752,4 C1.4509999752044678,4 1.0010000467300415,3.549999952316284 1.0010000467300415,3 C1.0010000467300415,2.450000047683716 1.4509999752044678,2 2.000999927520752,2 C2.000999927520752,2 3.000999927520752,2 3.000999927520752,2 C3.000999927520752,2 3.000999927520752,1 3.000999927520752,1 C3.000999927520752,0.44999998807907104 3.4509999752044678,0 4.000999927520752,0z"></path></g></g><g transform="matrix(1,0,0,1,15,15)" opacity="0.8" style="display: block;"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,255,255)" fill-opacity="1" d=" M6,-6 C6,-6 -6.004000186920166,-6 -6.004000186920166,-6 C-6.513999938964844,-6 -6.943999767303467,-5.610000133514404 -6.99399995803833,-5.119999885559082 C-6.99399995803833,-5.119999885559082 -7.004000186920166,-5 -7.004000186920166,-5 C-7.004000186920166,-5 -7.004000186920166,5 -7.004000186920166,5 C-7.004000186920166,5.510000228881836 -6.613999843597412,5.940000057220459 -6.124000072479248,5.989999771118164 C-6.124000072479248,5.989999771118164 -6.004000186920166,6 -6.004000186920166,6 C-6.004000186920166,6 6,6 6,6 C6.510000228881836,6 6.940000057220459,5.610000133514404 6.989999771118164,5.119999885559082 C6.989999771118164,5.119999885559082 7,5 7,5 C7,5 7,-5 7,-5 C7,-5.510000228881836 6.610000133514404,-5.940000057220459 6.119999885559082,-5.989999771118164 C6.119999885559082,-5.989999771118164 6,-6 6,-6z M7,-8 C8.100000381469727,-8 9,-7.099999904632568 9,-6 C9,-6 9,6 9,6 C9,7.099999904632568 8.100000381469727,8 7,8 C7,8 -7,8 -7,8 C-8.100000381469727,8 -9,7.099999904632568 -9,6 C-9,6 -9,-6 -9,-6 C-9,-7.099999904632568 -8.100000381469727,-8 -7,-8 C-7,-8 7,-8 7,-8z"></path></g></g></g></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="30" height="30" class="xgplayer-cssfullscreen-exit" preserveAspectRatio="xMidYMid meet" style="width: 100%; height: 100%; transform: translate3d(0px, 0px, 0px);"><defs><clipPath id="__lottie_element_36"><rect width="30" height="30" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_36)"><g style="display: none;"><g><path></path></g></g><g transform="matrix(1,0,0,1,15,15)" opacity="0.8" style="display: block;"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,255,255)" fill-opacity="1" d=" M-2,-4 C-1.4500000476837158,-4 -1,-3.549999952316284 -1,-3 C-1,-3 -1,-1 -1,-1 C-1,-0.49000000953674316 -1.3899999856948853,-0.05999999865889549 -1.8799999952316284,-0.009999999776482582 C-1.8799999952316284,-0.009999999776482582 -2,0 -2,0 C-2,0 -4,0 -4,0 C-4.550000190734863,0 -5,-0.44999998807907104 -5,-1 C-5,-1.5499999523162842 -4.550000190734863,-2 -4,-2 C-4,-2 -3,-2 -3,-2 C-3,-2 -3,-3 -3,-3 C-3,-3.549999952316284 -2.549999952316284,-4 -2,-4z M4,0 C4.550000190734863,0 5,0.44999998807907104 5,1 C5,1.5499999523162842 4.550000190734863,2 4,2 C4,2 3,2 3,2 C3,2 3,3 3,3 C3,3.549999952316284 2.549999952316284,4 2,4 C1.4500000476837158,4 1,3.549999952316284 1,3 C1,3 1,1 1,1 C1,0.44999998807907104 1.4500000476837158,0 2,0 C2,0 4,0 4,0z M6,-6 C6,-6 -6,-6 -6,-6 C-6.510000228881836,-6 -6.940000057220459,-5.610000133514404 -6.989999771118164,-5.119999885559082 C-6.989999771118164,-5.119999885559082 -7,-5 -7,-5 C-7,-5 -7,5 -7,5 C-7,5.510000228881836 -6.610000133514404,5.940000057220459 -6.119999885559082,5.989999771118164 C-6.119999885559082,5.989999771118164 -6,6 -6,6 C-6,6 6,6 6,6 C6.510000228881836,6 6.940000057220459,5.610000133514404 6.989999771118164,5.119999885559082 C6.989999771118164,5.119999885559082 7,5 7,5 C7,5 7,-5 7,-5 C7,-5.510000228881836 6.610000133514404,-5.940000057220459 6.119999885559082,-5.989999771118164 C6.119999885559082,-5.989999771118164 6,-6 6,-6z M6,-8 C7.599999904632568,-8 8.899999618530273,-6.75 8.989999771118164,-5.179999828338623 C8.989999771118164,-5.179999828338623 9,-5 9,-5 C9,-5 9,5 9,5 C9,6.599999904632568 7.75,7.900000095367432 6.179999828338623,7.989999771118164 C6.179999828338623,7.989999771118164 6,8 6,8 C6,8 -6,8 -6,8 C-7.599999904632568,8 -8.899999618530273,6.75 -8.989999771118164,5.179999828338623 C-8.989999771118164,5.179999828338623 -9,5 -9,5 C-9,5 -9,-5 -9,-5 C-9,-6.599999904632568 -7.75,-7.900000095367432 -6.179999828338623,-7.989999771118164 C-6.179999828338623,-7.989999771118164 -6,-8 -6,-8 C-6,-8 6,-8 6,-8z"></path></g></g></g></svg></button>
                <button class="btn full-screen" tabindex="0" aria-labelledby="xg-fullscreen-tips"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="30" height="30" class="xgplayer-fullscreen-enter" preserveAspectRatio="xMidYMid meet" style="width: 100%; height: 100%; transform: translate3d(0px, 0px, 0px);"><defs><clipPath id="__lottie_element_44"><rect width="30" height="30" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_44)"><g transform="matrix(1,0,0,1,15,15)" opacity="0.8" style="display: block;"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,255,255)" fill-opacity="1" d=" M3.5,6 C2.950000047683716,6 2.5,6.449999809265137 2.5,7 C2.5,7.550000190734863 2.950000047683716,8 3.5,8 C3.5,8 6,8 6,8 C7.099999904632568,8 8,7.099999904632568 8,6 C8,6 8,3.5 8,3.5 C8,2.950000047683716 7.550000190734863,2.5 7,2.5 C6.449999809265137,2.5 6,2.950000047683716 6,3.5 C6,3.5 6,5 6,5 C6,5.510000228881836 5.610000133514404,5.940000057220459 5.119999885559082,5.989999771118164 C5.119999885559082,5.989999771118164 5,6 5,6 C5,6 3.5,6 3.5,6z M-6,3.5 C-6,2.950000047683716 -6.449999809265137,2.5 -7,2.5 C-7.550000190734863,2.5 -8,2.950000047683716 -8,3.5 C-8,3.5 -8,6 -8,6 C-8,7.099999904632568 -7.099999904632568,8 -6,8 C-6,8 -3.5,8 -3.5,8 C-2.950000047683716,8 -2.5,7.550000190734863 -2.5,7 C-2.5,6.449999809265137 -2.950000047683716,6 -3.5,6 C-3.5,6 -5,6 -5,6 C-5.510000228881836,6 -5.940000057220459,5.610000133514404 -5.989999771118164,5.119999885559082 C-5.989999771118164,5.119999885559082 -6,5 -6,5 C-6,5 -6,3.5 -6,3.5z M3.5,-6 C2.950000047683716,-6 2.5,-6.449999809265137 2.5,-7 C2.5,-7.550000190734863 2.950000047683716,-8 3.5,-8 C3.5,-8 6,-8 6,-8 C7.099999904632568,-8 8,-7.099999904632568 8,-6 C8,-6 8,-3.5 8,-3.5 C8,-2.950000047683716 7.550000190734863,-2.5 7,-2.5 C6.449999809265137,-2.5 6,-2.950000047683716 6,-3.5 C6,-3.5 6,-5 6,-5 C6,-5.510000228881836 5.610000133514404,-5.940000057220459 5.119999885559082,-5.989999771118164 C5.119999885559082,-5.989999771118164 5,-6 5,-6 C5,-6 3.5,-6 3.5,-6z M-6,-3.5 C-6,-2.950000047683716 -6.449999809265137,-2.5 -7,-2.5 C-7.550000190734863,-2.5 -8,-2.950000047683716 -8,-3.5 C-8,-3.5 -8,-6 -8,-6 C-8,-7.099999904632568 -7.099999904632568,-8 -6,-8 C-6,-8 -3.5,-8 -3.5,-8 C-2.950000047683716,-8 -2.5,-7.550000190734863 -2.5,-7 C-2.5,-6.449999809265137 -2.950000047683716,-6 -3.5,-6 C-3.5,-6 -5,-6 -5,-6 C-5.510000228881836,-6 -5.940000057220459,-5.610000133514404 -5.989999771118164,-5.119999885559082 C-5.989999771118164,-5.119999885559082 -6,-5 -6,-5 C-6,-5 -6,-3.5 -6,-3.5z"></path></g></g></g></svg><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="30" height="30" class="xgplayer-fullscreen-exit" preserveAspectRatio="xMidYMid meet" style="width: 100%; height: 100%; transform: translate3d(0px, 0px, 0px);"><defs><clipPath id="__lottie_element_49"><rect width="30" height="30" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_49)"><g transform="matrix(1,0,0,1,15,15)" opacity="0.8" style="display: block;"><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,255,255)" fill-opacity="1" d=" M-3,-7.5 C-3,-8.050000190734863 -3.450000047683716,-8.5 -4,-8.5 C-4.550000190734863,-8.5 -5,-8.050000190734863 -5,-7.5 C-5,-7.5 -5,-6 -5,-6 C-5,-5.449999809265137 -5.449999809265137,-5 -6,-5 C-6,-5 -7.5,-5 -7.5,-5 C-8.050000190734863,-5 -8.5,-4.550000190734863 -8.5,-4 C-8.5,-3.450000047683716 -8.050000190734863,-3 -7.5,-3 C-7.5,-3 -5,-3 -5,-3 C-3.9000000953674316,-3 -3,-3.9000000953674316 -3,-5 C-3,-5 -3,-7.5 -3,-7.5z M7.5,-3 C8.050000190734863,-3 8.5,-3.450000047683716 8.5,-4 C8.5,-4.550000190734863 8.050000190734863,-5 7.5,-5 C7.5,-5 6,-5 6,-5 C5.449999809265137,-5 5,-5.449999809265137 5,-6 C5,-6 5,-7.5 5,-7.5 C5,-8.050000190734863 4.550000190734863,-8.5 4,-8.5 C3.450000047683716,-8.5 3,-8.050000190734863 3,-7.5 C3,-7.5 3,-5 3,-5 C3,-3.9000000953674316 3.9000000953674316,-3 5,-3 C5,-3 7.5,-3 7.5,-3z M-3,7.5 C-3,8.050000190734863 -3.450000047683716,8.5 -4,8.5 C-4.550000190734863,8.5 -5,8.050000190734863 -5,7.5 C-5,7.5 -5,6 -5,6 C-5,5.449999809265137 -5.449999809265137,5 -6,5 C-6,5 -7.5,5 -7.5,5 C-8.050000190734863,5 -8.5,4.550000190734863 -8.5,4 C-8.5,3.450000047683716 -8.050000190734863,3 -7.5,3 C-7.5,3 -5,3 -5,3 C-3.9000000953674316,3 -3,3.9000000953674316 -3,5 C-3,5 -3,7.5 -3,7.5z M7.5,3 C8.050000190734863,3 8.5,3.450000047683716 8.5,4 C8.5,4.550000190734863 8.050000190734863,5 7.5,5 C7.5,5 6,5 6,5 C5.449999809265137,5 5,5.449999809265137 5,6 C5,6 5,7.5 5,7.5 C5,8.050000190734863 4.550000190734863,8.5 4,8.5 C3.450000047683716,8.5 3,8.050000190734863 3,7.5 C3,7.5 3,5 3,5 C3,3.9000000953674316 3.9000000953674316,3 5,3 C5,3 7.5,3 7.5,3z"></path></g></g></g></svg></button>
            </div>
        </div>
    </div>
    <script src="./watermelon.js" type="text/javascript"></script>
</body>

</html>